import Vue from 'vue'
import Vuex from 'vuex'
import { Toast } from 'vant'

Vue.use(Vuex)
export default new Vuex.Store({
  state: {
    // 定义购物车数组 如果本地取出则取本地，如果没有则取空
    carArr: JSON.parse(localStorage.getItem('car') || '[]')
  },
  mutations: {
    // 点击加入购物车 把商品信息保存到store中的car上
    // 先需要判断购物车中是否有对应的商品,如果有更新数量即可 若没有就讲数据push到car上
    setCarArr(state, val) {
      const obj = {}
      console.log(val)
      obj.id = val.id - 0
      obj.cou = val.cou - 0
      obj.price = val.price
      obj.selected = true
      var flag = true
      state.carArr.forEach(item => {
        if (item.id === obj.id) {
          item.cou += val.cou
          return (flag = false)
        }
      })
      Toast.success('已添加到购物车')
      if (flag) state.carArr.push(obj)
      localStorage.setItem('car', JSON.stringify(state.carArr))
    },
    // 点击加号增加商品数量
    addStepper(state, id) {
      state.carArr.forEach(item => {
        if (item.id === id) item.cou++
      })
      localStorage.setItem('car', JSON.stringify(state.carArr))
    },
    // 点击减号减少商品数量
    subStepper(state, id) {
      state.carArr.forEach(item => {
        if (item.id === id) item.cou--
      })
      localStorage.setItem('car', JSON.stringify(state.carArr))
    }
  },
  getters: {
    // 计算数量
    count(state) {
      let count = 0
      // 循环购物车数组
      state.carArr.forEach(item => {
        count += item.cou
      })
      // 导出
      return count
    },
    isEmpty(state) {
      if (state.carArr.length === 0) {
        return true
      } else {
        return false
      }
    }
  },
  actions: {},
  modules: {}
})
